<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script>
    // 全局变量: 在函数外声明的变量(全局作用域)    
    // 全局变量和方法存储在window中  =>  window全局对象 (Global Object  => GO对象)

    // 局部变量: 在函数内声明的变量(函数作用域/局部作用域)
    // 局部变量和方法存储在AO中   => Activation Object (活跃对象 => AO对象)

    // 作用域链:  函数内查找变量和方法时,自己有就找自己的,自己没有就向外条一层找父作用域,依次类推,如果全局作用都找不到,就会报错(变量和方法未定义)
    // 


    // 执行空间(执行栈)
    // 函数在第一次执行被调用时会创建一个执行空间(call stack), 执行空间中存在this arguments AO对象(存储函数内的变量和方法), 等函数执行完毕, 跳出函数的执行栈(此时函数内的AO对象会被释放掉),进入全局执行栈,代码继续向后执行

    // 调用函数时: 从全局执行栈 => 进入到函数的执行栈  => 入栈
    // 函数执行完毕: 从函数的执行栈 => 跳出到全局执行栈  => 出栈




    /* debugger;

    // 全局:
    var a = 10;
    var b = 20;

    function fn() {
        // 局部: 
        var a = 100;
        var b = 200;
        console.log(a, b);
    }

    fn();

    console.log(a, b); */


    debugger;
    // 全局  GO:{a:10,b:20}
    var a = 10;
    var b = 20;

    function fn() {
        // 局部:  AO(fn):{a:100,b:200} 
        var a = 100;
        var b = 200;
        console.log(a, b);

        function func() {
            // 局部:  AO(func):{x:1000,b:2000} 
            var x = 1000;
            var y = 2000;
            console.log(x, y, a, b);
        }
        func();
    }

    fn();

    console.log(a, b);




</script>

</html>